<template>
  <div class="information">
    <span class="info-title">资讯</span>
    <div class="info-contents">
      <vue-seamless-scroll :data="items" class="seamless-warp">
        <ul id="info-scroll">
          <li v-for="(item,index) in items" :key="index">{{item}}</li>
        </ul>
      </vue-seamless-scroll>
    </div>
  </div>
</template>
<script>
import { elecSandTableApi } from "@/services/WorkCenter";
export default {
  data() {
    return {
      items: []
    };
  },
  methods: {
    getInfoList() {
      elecSandTableApi.getInfoList()
        .then(res => {
          this.items=res.data
        })
        .catch(error => {
          console.log(error);
        });
    }
  },
  mounted(){
    this.getInfoList();
  }
};
</script>
<style lang="scss" scoped>
.information {
  .info-title {
    color: #FFA201;
    font-size: 16px;
    padding-left: 3%;
    display: block;
    margin: 1vh 2% 0 2%;
    // background: #2b66b7;
    // opacity: 30%;
    font-weight:bold;
  }
  .info-contents {
    width: 90%;
    height: 23vh;
    font-size: 14px;
    overflow: hidden;
    /* padding-left: 30px; */
    color: #e5e5e5;
    margin-top: 10px;
    .seamless-warp {
      overflow: hidden;
      #info-scroll li {
        list-style: none;
        height: 50px;
        margin-left: 20px;
      }
    }
  }
}
</style>